<template>
	<view class="container" :style="'padding-bottom:'+(bottomTabbar>0?bottomTabbar + 80 : 86 )+'px;'">
		<!-- 自定义导航栏 -->
		<view class="top-box">
			<view :style="'height:' + statusBarHeight + 'px'"/>
			<view class="navTopBox" :style="'height:' + navBarHeight + 'px;'">
				<view class="left-button-box" :style="'height:' + menuButtonInfo.height + 'px;'">
					<!-- margin-top:'+(menuButtonInfo.top - statusBarHeight)+'px' -->
					<image @click="tapToBack('back')" src="../../static/back.png" mode="aspectFill"></image>
					<view class="line"></view>
					<image src="../../static/detail/home.png" mode="aspectFill" @click="tapToBack('index')"></image>
				</view>
				<view class="right-button-box">
					商户详情
				</view>
			</view>
		</view>
		
		<!-- banner -->
		<view class="banner" :style="'padding-top:' + paddTop + 'px'">
			<swiper  v-if="store.poster.imageUrl" class="swiper" :autoplay="true" duration="500" :circular="true">
				<swiper-item v-for="(item,index) in store.poster.imageUrl" :key="index">
					<view class="item">
						<image :src="item?item:'../../static/lazy_detail.png'" class="img" mode="aspectFill" @click="imagePreview(index,store.poster.imageUrl)"></image>
					</view>
				</swiper-item>
			</swiper>
			
			<swiper v-else class="swiper" :autoplay="true" duration="500" :circular="true">
				<swiper-item v-for="(item,index) in posterArr" :key="index">
					<view class="item">
						<image :src="item" class="img" mode="aspectFill"></image>
					</view>
				</swiper-item>
			</swiper>
		</view>
		<!-- 商家信息 -->
		<!-- <view class="store-info store-box" :style="'margin-top:'+(mineInfo.vip_level<=0?-20:-60)+'rpx;'"> -->
		<view class="store-info" style="margin-top:-60rpx;">
			<view class="store-info-box">
				<!-- <view class="store-info-name">{{store.name}}</view>
				<view class="store-info-tags">
					<block v-for="(tag , tagIndex) in store.tags" :key="tagIndex">
						<text>{{tag}}</text> 
						<text v-if="tagIndex+1!==store.tags.length">·</text>
					</block>
				</view> -->
				<view class="main1">
					<view class="main_top" v-if="store.name">
						{{store.name}}
					</view>
					<view class="main_content" v-if="store.tags&&!store.tags[0].match(/^\s+$/)">
						<view class="con_left">
							<image src="../../static/jf/img8.png" mode="widthFix" class="img"></image>
						</view>
						<view class="con_right">
							<view class="con_rightBox" v-if="store.tags[0]">
								{{store.tags[0]}}
							</view>
						</view>
					</view>
					<view class="main_bottom">
						<view class="maim_bleft">
							<view class="view1">{{store.address}}</view>
							<view class="view2" v-if="mapDuration&&store.distance">距您步行{{store.distance}}，需要{{mapDuration}}分钟</view>
						</view>
						<view class="maim_bright">
							<view class="view1" @click="phoneClick"  v-if="mineInfo.balance>0">
								<view class="view_box">
									<image src="../../static/Vector16.png" mode="aspectFill" class="img"></image>
								</view>	
								
								<view class="text">
									联系
								</view>	
							</view>	
							<view class="view2" @click="openMap">
								<view class="view_box">
									<image src="../../static/Vector15.png" mode="aspectFill" class="img"></image>
								</view>	
								<view class="text">
									导航
								</view>	
							</view>	
						</view>
					</view>
				</view>
				
				
				<!-- 红包 -->
				<view class="redPacket">
					<view class="redPacket_top">
						粉丝红包
					</view>
					<view class="redPacket_bot">
						<block v-for="(item,index) in store.redEnvelopeList" :key="index">
							<view class="item" v-if="item.status==0" @click="drawRedPacket(item)">
								<image src="https://imgs.ynz666.com/test/2023/11/29/Yjg1NmYyMjk5OTk2ODJjNGQ1ZjA2MzJjY2Q2ZGVmZTQ=.png" class="img"></image>
								<view class="name">领取提现</view>
							</view>
							<view class="item item2" v-if="item.status==1">
								<image src="https://imgs.ynz666.com/test/2023/11/29/YjIyNmM0NTQ5ZTFlZjVlNmRlZWQzMDhmZmI3OGQyODQ=.png" class="img"></image>
								<view class="name">已领取</view>
							</view>
							<view class="item item3" v-if="item.status==2">
								<image src="https://imgs.ynz666.com/test/2023/11/29/ZjBjY2MzMTYzYWQ3ZmM3ZmYwOTUxNDI1NDQ0Mjk0YmU=.png" class="img"></image>
								<view class="name">来晚了</view>
							</view>
						</block>
					</view>
				</view>
				
				<!-- 商家权益 -->
				<!-- v-if="store.members_interests && store.members_interests.length>0" -->
				<view class="store-info-interests" v-if="store.members_interests.length>0||auctionList.length>0">
				<!-- 	<scroll-view :scroll-x="true" :enable-flex='true' class="scroll-view" :bounces='true' :enhanced='true' :show-scrollbar='false'> -->
							<view class="store-info-interests-top">
								<!-- <image src="https://imgs.ynz666.com/xiuxian/detail-coupon.png" mode="aspectFill"></image> -->
								<view class="view_left">
									免单券兑换区
								</view>
								<view class="view_right">
									到店出示二维码兑换
								</view>
							</view>	
							<view class="scroll-item" v-for="(ins , insIndex) in store.members_interests" :key="insIndex">
								<view style="display: flex;flex:1;align-items: center;">
									<image :src="ins.icon?ins.icon:'../../static/qy_i1.png'" class="scroll-vip-thumb"></image>
									<view class="scroll-item-right">
										<view class="view1">{{ins.name}}</view>
										<view class="view2">
										 {{ins.value}}
										 <!-- <view class="useNum">
										 	{{store.useNum}}次/月
										 </view>	 -->
										</view>
									</view>
								</view>
								<!-- store.isAppointment===false&& -->
								<!-- v-if="store.isOpen" -->
								
								<view class="btnAll">
								<view class="scroll_right" @click="openbalance" v-if="store.isBussiness&&store.isOpen">
									兑换
								</view>
								<!-- store.isAppointment===false&& -->
								<view class="scroll_right_two" v-if="!store.isBussiness&&store.isOpen">
									兑换
								</view>
								<view class="scroll_right_two" v-if="!store.isOpen">
									兑换
								</view>
								<button v-if="!mineInfo.phone && mineInfo.phone.length!==11" open-type="getPhoneNumber" @getphonenumber.stop="onGetPhoneNumber"></button>
								</view>
								<!-- <view class="scroll-item-bottom" v-if="store.members_interests.length-insIndex>1">
									<view class="item-bottom_left"></view>
									<view class="item-bottom_center">
										<view class="center-xian"></view>	
									</view>
									<view class="item-bottom_right"></view>
								</view>	 -->
							</view>
						<!-- 	<view class="scroll-item" style="border: none;padding: 5px;background: none;width: 0;"></view> -->
					<!-- </scroll-view> -->
					<!-- 抢购品 -->
					<view class="auctionGood">
						<view class="aucItem" v-for="(item,index) in auctionList" :key="index">
							<view class="aut_left">
								<image :src="item.imageUrl" class="left"></image>
								<view class="right">
									<!-- <view class="rig_view1"> -->
										<view class="rig_top">
											{{item.name}}
										</view>
										<view class="rig_bot">
											<view class="bot_view1">
												价值：{{item.baseValue/100}}元
											</view>
											<view class="bot_view2">
												仅需免单券抢购获得
											</view>
										<!-- </view> -->
									</view>
									<!-- <view class="rig_view2">
										仅需免单券抢购获得
									</view> -->
								</view>
							</view>
							<view class="aut_rightTwo" @click="openMaskAuction(item)" v-if="item.status==0">
								立即抢购
							</view>
							<view class="aut_right" @click="goLook(2,item.id)" v-if="item.status==1">
								立即抢购
							</view>
						</view>
					</view>
				</view>
				<!-- 商家要求核酸进店 -->
				<view class="store-info-notice" v-if="store.notice">
					<image src="../../static/detail/message.png" mode="aspectFill"></image>
					<view>{{store.notice}}</view>
				</view>
			</view>
		</view>
		
		
		
		
		
		<!-- 商家地址 -->
		<!-- <view class="store-address store-box">
			<view class="store-address-detail">
				<view class="store-address-name word-line-clamp2">{{store.address}}</view>
				<view class="store-address-time" v-if="mapDuration&&store.distance">距您步行{{store.distance}}，需要{{mapDuration}}分钟</view>
			</view>
			<view class="store-address-image" @click="openMap">
				<image src="../../static/qy_i4.png" mode=""></image>
			</view>
		</view> -->
		
		<!-- 团购 -->
		<!-- <view class="store-goods store-box" v-if="shopList && shopList.length>0">
			<view class="store-goods-title">
				<image src="https://hesen-gfn-public.oss-cn-shenzhen.aliyuncs.com/default/storeDetail-shop.png" mode=""></image>
				<view class="store-goods-title-txt">商品</view>
			</view>
			<view class="store-goods-list">
				<scroll-view :scroll-x="true" class="scroll-view-goods" :bounces='true' :enhanced='true' :show-scrollbar='false'>
					<view class="store-goods-item" v-for="(goods , goodsIndex) in shopList" :key='goodsIndex'  @click="jumpPage(goods.id)">
						<image :src="goods.goodsImages[0]?goods.goodsImages[0]:'../../static/lazy_index.png'" mode="aspectFill"></image>
						<view class="store-goods-name word-line-clamp1">{{goods.goodsName}}</view>
						<view class="store-goods-price">
							<view> <text>¥</text> <text>{{goods.memberPrice}}</text></view>
						</view>
					</view>
				</scroll-view>
			</view>
		</view> -->
		
		<!-- 超值团购 Group -->
		<view class="group" v-if="store.coupons.length!==0">
			<view class="group_top">
				超值团购
			</view>
			<view class="group_bottom">
				<view class="item" v-for="(item,index) in store.coupons" :key="index" @click="jumpVoucher(item.id)">
					
					<view class="item_bottom">
						<view class="b_left">
							<view class="item_top">{{item.name}}</view>
							<view class="view1">
							{{item.useTime}}·
						  <text v-if="item.useNum==0">不限张数</text>
							<text v-else>限使用{{item.useNum}}张</text>
							·{{item.useScope}}
							</view>
							<view class="view2">￥{{item.price/100}}
							 <view class="zk">{{item.discount}}折</view>
							</view>
						</view>
						
						<!-- <button v-if="!mineInfo.phone && mineInfo.phone.length!==11" open-type="getPhoneNumber" @getphonenumber.stop="onGetPhoneNumberT(item.id)"></button> -->
						<view class="b_right b_rightTow" v-if="item.actvity.status">
							<view class="packet_view1">
								<image src="https://imgs.ynz666.com/2023/12/04/NzEyYTcwNjA1MTJlNDU5OTZmYzYyYjRiNTE5YTQ2MDM=.png" mode="aspectFill" class="img"></image>
								<view class="v1_box">
									{{item.actvity.redEnvelopeAmount/100}}
								</view>
							</view>
							<view class="packet_view2">
								参团领红包
							</view>
							
						</view>
						<view class="b_right" v-else>
							<view class="view1">抢购</view>
							<view class="view2">已售 {{item.saleNum}}</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		
		<view class="superCon" v-if="shopList && shopList.length>0">
			<view class="top">
				<view class="top_left">
					超值推荐
				</view>
				<view class="top_right" @click="jumpPageD">
					加购更多商品  >
				</view>
			</view>
			<view class="bottom">
				<scroll-view :scroll-x="true" class="scroll-view-goods" :bounces='true' :enhanced='true' :show-scrollbar='false'>
					<view class="item" v-for="(goods , goodsIndex) in shopList" :key='goodsIndex' @click="jumpPageD">
						<image :src="goods.goodsImages[0]?goods.goodsImages[0]:'../../static/lazy_index.png'" mode="aspectFill" class="item_img"></image>
						<view class="name">{{goods.goodsName}}</view>
						<view class="price">¥{{goods.price}}</view>
					</view>
				</scroll-view>
				<!-- <view class="item" v-for="(item,index) in 3">
					<image src="../../static/qy_i1.png" class="item_img"></image>
					<view class="name">羊肉饺子汤</view>
					<view class="price">¥19.8</view>
				</view> -->
			</view>
		</view>
		
		
		<!-- 用户评价 -->
		<view class="store-comment store-box" v-if="totalCommentCount>0">
			<view class="store-comment-title">
				<view class="store-comment-txt">用户评价<text>({{totalCommentCount}})</text></view>
				<view class="store-comment-more" v-if="totalCommentCount>2" @click="JumpMoreComment(store.store_id)">
					<view>查看更多</view> 
					<image src="../../static/mine/right-arrow.png" mode=""></image>
				</view>
			</view>
			<view class="user_comment">
				<block v-if="commentList.length<=2">
					<view class="user_comment_item" v-for="(comment,index) in commentList" :key='index'>
						<view class="user_comment_title">
							<image :src="comment.avatar" class="user_comment_avatar" mode="aspectFill"></image>
							<view>
								<view class="name">{{comment.nickName}}</view>
								<view class="date">{{comment.commentTime}}</view>
							</view>
						</view>
						<view class="user_content">{{comment.content}}</view>
						<view class="user_comment_image">
							<image v-for="(img,imgIndex) in comment.commentImages" :key='imgIndex' :src="img" mode="aspectFill" @click="imagePreview(imgIndex,comment.commentImages)"></image>
						</view>
					</view>
				</block>
				<block v-if="commentList.length>2">
					<view class="user_comment_item">
						<view class="user_comment_title">
							<image :src="commentList[0].avatar" class="user_comment_avatar" mode="aspectFill"></image>
							<view>
								<view class="name">{{commentList[0].nickName}}</view>
								<view class="date">{{commentList[0].commentTime}}</view>
							</view>
						</view>
						<view class="user_content">{{commentList[0].content}}</view>
						<view class="user_comment_image">
							<image v-for="(img,imgIndex) in commentList[0].commentImages" :key='imgIndex' :src="img" mode="aspectFill" @click="imagePreview(imgIndex,commentList[0].commentImages)"></image>
						</view>
					</view>
					<view class="user_comment_item">
						<view class="user_comment_title">
							<image :src="commentList[1].avatar" class="user_comment_avatar" mode="aspectFill"></image>
							<view>
								<view class="name">{{commentList[1].nickName}}</view>
								<view class="date">{{commentList[1].commentTime}}</view>
							</view>
						</view>
						<view class="user_content">{{commentList[1].content}}</view>
						<view class="user_comment_image">
							<image v-for="(img,imgIndex) in commentList[1].commentImages" :key='imgIndex' :src="img" mode="aspectFill" @click="imagePreview(imgIndex,commentList[1].commentImages)"></image>
						</view>
					</view>
				</block>
			</view>
		</view>

<!-- 　		免单券使用须知 -->
		<view class="equi-box store-box">
			<view class="coupon-title" @click="showCouponTip">
				<view>免单券使用须知</view>
				<view class="down-arrow" :class="{active : showCoupon}"></view>
			</view>
			<!-- 注意事项 -->
			<block v-if="showCoupon">
			<view class="base-title base-title-os" style="margin-top: 16rpx;margin-bottom: 16rpx;">使用须知</view>
			<view class="base-list-box">预约商户到店请仔细查看免单券权益，商户将按照平台公示的权益进行服务提供，到店请主动出示二维码进行到店核销，因未核销产生的纠纷平台将不予以负责和处理。</view>
			<!-- <view class="base-list-box">{{store.member_noti}}</view>
			 <block v-if="store.base_info && store.base_info.length>0">
				<view class="base-title base-title-os">店铺设施</view>
				<view class="base-list-box"> 本店提供： 
					<block v-for="(label , index) in store.base_info" :key='index'>
						<text>{{label.name}}</text>
						<text v-if='index!==store.base_info.length-1'>、</text>
					</block>等基础服务。
				</view>
			</block> -->
			
			<view class="base-title base-title-os">温馨提示</view>
			<view class="base-list-box">商户为免单券用户提供的免费权益请按需使用，不要造成资源浪费；平台禁止他人代领或者借用转让，一经发现平台将收回免单券资格；平台严禁免单券会员通过转让商户提供的权益资源进行牟利等行为。</view>
		
		 
		 	<view class="base-title base-title-os">取消说明</view>
		 	<view class="base-list-box" :style="'margin-bottom:0rpx;'">用户可以在预约界面进行取消（免预约商户无需进行取消），多次取消可能会影响你的下次预约；
			<!-- 如果发生迟到45分钟或者爽约行为，用户的本次预约将失效，商户可以拒绝接待。 --></view>
		</block>
		</view>
		
		
		
		
		<view class="detail-foot" v-if="store.members_interests.length>0&&isTimeLimit==0">
			<block v-if="mineInfo.id && store.store_id">
				<!-- 是否是暂未开放 -->
				<view class="isopen" v-if="store.isOpen">
					<!-- 是否是vip -->
					<!-- mineInfo.vip_level>0||mineInfo.balance>0 -->
					<block v-if="mineInfo.vip_level>0||mineInfo.balance>0">
						<view class="isvip">
							<!-- store.isBuy 商家是否可以使用买单支付-->
							<view class="isvip_left isvip_left_new" @click="payBill" v-if="store.isBuy">
								<text class="text1">买单</text>
								<!-- <view class="isvip_left_top">兑换需免单券：<text class="vip_text">1 张</text></view>
								<view class="isvip_left_bottom">当前剩余 {{mineInfo.balance}} 张  <text v-if="mineInfo.vip_level==0">(分享所得券)</text>
								</view> -->
							</view>
							<!-- <view :class="store.isBuy?'isvip_right':'isvip_right isvip_rightT'">
								<view class="vip_btn1" v-if="store.isAppointment===false&&store.isBussiness" @click="toBooking">
								<text class="t1">出示二维码</text>
								<text class="t2">兑换需免单券1张/当前剩余{{mineInfo.balance}}张</text>
								</view>
								
								<view class="vip_btn2" v-if="store.isAppointment===false&&!store.isBussiness">
								商户已打烊
								</view>
								
								<view class="vip_btn3" hover-class="detail-res-hover" v-if="store.isAppointment===true" @click="toBooking">
								立即预约
								</view>
								
							</view> -->
						</view>
					</block>
					<block v-else>
						<view class="wu_box">
						<view class="kef" @click="WeixinServer">
							<image src="../../static/mine/img13.png" mode="widthFix" class="img"></image>
						</view>
						<view class="no_isvip">
							<!-- <view>购买休闲吧免单券</view>
							<view>平台所有商户都能用，免单又省钱</view>
							<button v-if="!mineInfo.phone && mineInfo.phone.length!==11" open-type="getPhoneNumber" @getphonenumber.stop="onGetPhoneNumber"></button> -->
							<view class="isvip_left" @click="payBill" v-if="store.isBuy">
								<text class="text1">买单</text>
							</view>
							<view class="isvip_right" :class="store.isBuy?'isvip_right':'isvip_right isvip_rightT'">
								<view class="vip_btn1" @click="toBooking">
									<text class="t1">购买免单券</text>
									<text class="t2">全场通用，吃喝玩乐都省钱</text>
								</view>
								<button v-if="!mineInfo.phone && mineInfo.phone.length!==11" open-type="getPhoneNumber" @getphonenumber.stop="onGetPhoneNumber"></button>
							</view>
						</view>
						</view>
					</block>
				</view>
				<view class="no_isopen" v-else>即将开放</view>
			</block>
			
		</view>
		
		<view class="detail-foot" v-if="store.members_interests.length==0&&store.isBuy">
			<view class="isopen">
			<block>
				<view class="wu_box">
				<view class="kef" @click="WeixinServer">
					<image src="../../static/mine/img13.png" mode="widthFix" class="img"></image>
				</view>
				<view class="no_isvip">
					<view class="isvip_leftMd" @click="payBill" v-if="store.isBuy">
						<text class="text1">买单</text>
					</view>
				</view>
				</view>
			</block>
			</view>
		</view>
		
		
		<!-- @click.stop="closeModal" -->
		<!-- 弹窗提示 -->
		<view class="maskTow" v-if="modalFlag">
			<view class="nomral-modal">
				<view class="bg-top left">输入金额</view>
				<view class="in">
					<input class="uni-input" @input="onKeyInputPr" placeholder="请输入金额" type="digit" placeholder-style="color:#F76260" :value="inputValue"/>
				</view>
				<block>
					<view class="nomral-btn" @tap.stop="jumpPageC">买单</view>
					<view class="nomral-tip" @click.stop="closeModal">关闭弹框</view>
				</block>
			</view>
		</view>
		
		<!-- 新用户领取免单 -->
		<view class="maskFour" v-if="modalFree">
			<view class="maskFour_box">
				<image
					src="https://imgs.ynz666.com/test/2023/11/29/ZGUxYTFkZGQ5MDEyZWMxY2E3NGIzN2M3NGIzNGNmZTQ=.png"
					mode="scaleToFill" class="free_img"></image>
					<image
						src="https://imgs.ynz666.com/test/2023/11/28/YmYxODJlNjVkYTJhZjYzYzdhODM0OTg3YWQ4NjM1Yzk=.png"
						mode="scaleToFill" class="free_btn" @click="getFreeCard"></image>
					<image
						src="https://imgs.ynz666.com/test/2023/11/07/YzkzMDgxYzEwM2Y0YjQ1N2QyMDcxOWFlMThhYjdlZWQ=.png"
						mode="scaleToFill" class="free_close" @click="getFreeCard"></image>
			</view>
		</view>
		
		
		<!-- 红包领取弹框 -->
		<view class="packetMask" v-if="modalPacket">
			<view class="packetMask_box">
				<image
					src="https://imgs.ynz666.com/2023/12/04/MzNhYTU2OTNiZWNmMzkyMTljMDhiZWY2NWNlNmJhNzM=.png"
					mode="scaleToFill" class="bj_img"></image>
					<view class="title">
						<image
							:src="redPacketData.pic"
							mode="scaleToFill" class="img"></image>
						<view class="name">
							{{redPacketData.storeName}}
						</view>
						<view class="desc">
							{{redPacketData.description}}
						</view>
					</view>
					<view class="bot">
						<image
							src="https://imgs.ynz666.com/test/2023/11/29/ZDQ3Yjg0Mzg2OGExZGJhYTkyYjM1ZTBkZTQzNDJhNTg=.png"
							mode="scaleToFill" class="img" @click="openRedPacket"></image>
					</view>
					
					<view class="fot">
						<image
							src="https://imgs.ynz666.com/2023/12/04/NTZkZTQ5MmVlYTQxODdkMzE3ZDZjNTE0OTg2NGFjZmQ=.png"
							mode="scaleToFill" class="img" @click="closeOpenRedPacket"></image>
					</view>
			</view>
		</view>
		
		
		<!-- 是否兑换免单券 -->
		<view class="maskFive" v-if="isBalance">
			<view class="maskFour_box">
				<view class="img_box">
					<image
						src="https://imgs.ynz666.com/2024/04/07/OTM5ZTIyYTJkMmQ0MTM5NDg3ZjNiMGY4YzEzMzJhM2Q=.png"
						mode="scaleToFill" class="free_img"></image>
						<view class="img_text">
							{{mineInfo.balance}}
						</view>
				</view>
				<view class="btn">
					<view class="btn1" @click="closebalance">
						取消
					</view>
					<!-- store.isAppointment===false&& -->
					<view class="btn2" v-if="store.isBussiness" @click="toBooking">
						确定
					</view>
				</view>
				
					
			</view>
		</view>
		
		<view class="maskAuction" v-if="maskAuction">
			<view class="maskAuction_box">
				<image src="https://imgs.ynz666.com/test/2024/12/09/ODRhMTI4NzlhNDNlMjlkOGE0YzgxNWRhMDkwOTllNWM=.png" mode="aspectFill" class="fri_img"></image>
				<view class="fri_box">
					<view class="text_view1">
						<view class="text_item">
							开始时间
						</view>
						<view class="text_item">
							{{auctionInfo.openTime.split(' ')[0]}}
						</view>
						<view class="text_item">
							{{auctionInfo.openTime.split(' ')[1]}}
						</view>
					</view>
					<view class="fri_btn" @click="goLook(1)">
						前往查看更多抢购商品
					</view>
				</view>
				
				<view class="fot">
					<image src="https://imgs.ynz666.com/test/storeInfo/ZTRjZjcwYWY2MWJlMDlmNjIyMTBhMGE5ODc2YWUwOWM=.png" mode="aspectFill" class="img" @click="closebalance"></image>
				</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	
	import Map from 'js_sdk/ms-openMap/openMap.js';
import QQMapWX from 'lib/qqmap-wx-jssdk/qqmap-wx-jssdk.min.js';
	var qqmapsdk = new QQMapWX({
		key: 'IYIBZ-3DC6U-HRYVF-2E3CJ-OSJDS-E5FDF' 
	});
	
	import gongType from '@/utils/debounce.js';
import http from '@/utils/request/http.js';
import { GetGoodsList, productOrderuse, productOrderUseInfo } from '../../apis/index.js';
import tipmodal from '../../components/tip-modal/tip-modal.vue';
	var app = getApp();
	export default {
		data() {
			return {
				modalFree:false,
				btnText:'',
				btnTextTow:'',
				posterArr:[
					'../../static/lazy_detail.png','../../static/lazy_detail.png','../../static/lazy_detail.png'
				],
				statusBarHeight: 0,
				windowHeight: 0,
				navBarHeight:0,
				bottomTabbar:0,
				menuButtonInfo:{},
				
				phoneLoginFlag:false,
				UserInfoFlag:false,
				inviteId:'',
				store_id: "",
				location: "",
				store: {},
				memberNotice: "您可以免费使用本场所的所有健身器材、保管箱及淋浴室，如果您需要私教服务则需要另外付费，请在健身过程中遵守文明和防疫要求，遇到突发状况听从店铺工作人员指挥。",
				navList:null,
				curNav: '',
				
				page: 1,
				pageSize: 10,
				isLastPage:false,
				
				shopList:[],
				shopPage:1,
				shopPageSize:10,
				shopLastPage:false,
				moreTip:'+展开查看',
				showGoodsFlag:false,
				
				mineInfo:{},
				commentList:[],
				totalCommentCount:0,//评论总数量
				
				shopDetailflag:false,//商户详情
				mapDuration:0, //规划时间
				
				scrollLeft: 0,
				old: {
				  scrollLeft: 0
				},
				
				paddTop:0,
				xinShopList:[
					{
						money:'99.0',
						time:'10次',
						validity:'30天内有效',
						text:'新人尝鲜 限购一次',
						type:1
					},
					{
						money:'499.0',
						time:'30天',
						validity:'每天可用5次',
						text:'95%的会员的选择',
						type:2
					}
				],
				xinShopIndex:0,
				hasOrder:false,
				showCoupon:true,
				
				isTimeLimit:0,//判断是不是从限时活动跳转过来的
				
				modalFlag:false,
				inputPay:0,
				
				isPayBill:false,// 商家是否可以使用买单支付
				
				
			  prductOrderId:0,
				prductInfo:{},
				
				modalPacket:false,//红包弹框
				redPacketList:[
					{
						type:1,
					},
					{
						type:1,
					},
					{
						type:1,
					},
					{
						type:2,
					},
					{
						type:3,
					},
					{
						type:3,
					},
					{
						type:3,
					}
				],//红包列表
				
				redPacketData:{},
				isBalance:false,
				inputValue:'',
				
				maskAuction:false,
				auctionList:[],//抢购列表
				auctionInfo:{},//单个抢购信息
			}	
		},
		components:{
			tipmodal,
		},
		onReady() {
			this.statusBarHeight = uni.getSystemInfoSync().statusBarHeight;
			this.menuButtonInfo = uni.getMenuButtonBoundingClientRect();
			this.navBarHeight =  uni.getMenuButtonBoundingClientRect().height +  ( uni.getMenuButtonBoundingClientRect().top - uni.getSystemInfoSync().statusBarHeight) * 2;
			this.windowHeight = uni.getSystemInfoSync().windowHeight;
			this.bottomTabbar = uni.getStorageSync('bottomTabbar');
			this.paddTop=this.statusBarHeight+this.navBarHeight
		},
		onLoad(options) {
			console.log(options,'storeDetail')
			let that = this;
			let inviteId = null;
			let store_id = null;
			that.location = app.globalData.latitude + "," + app.globalData.longitude;
			
			
			let xuScene=decodeURIComponent(options.scene)
			// console.log(xuScene,"xuScene")
			let xuData={}
			let xuParams = xuScene.split(',')
			// console.log(xuParams,"xuParams")
			for (var i in xuParams) {
					console.log(xuParams[i])
					//把一个字符串分割成字符串数组 split值可以更换 例如：: , = 或者其它; 案例 ID=278 输出：ID,278
					var val = xuParams[i].split('=');
					val.length > 0 && val[0] && (xuData[val[0]] = val[1] || null)
			}
			// console.log(xuData,"xuData")
			// 判断是不是销售
			if(xuData.sId){
				console.log(222)
				console.log(xuData.sId,"xuData.sId")
				uni.setStorageSync('xiuXianSaleId',xuData.sId);
			}
			
			// 正常进 小程序码进 分享进
			app.isLogin({},function(login){
				if(options.inviteId && options.store_id && options.shopId){
					// 分享进
					inviteId = options.inviteId;
					store_id = options.store_id;
					that.inviteId = inviteId;
					that.store_id = store_id;
					that.isTimeLimit=options.isTimeLimit;
					that.getDetail(store_id, that.location);
					that.LoginInvite(login);
					http.post('/api/order/v1/goods/buy',{
						id:options.shopId,
						type:1,
					}).then( payment => {});
				}else if(options.scene){
					console.log(options.scene,"options.scene111")
					// 小程序码
					let qrSourceId = decodeURIComponent(options.scene).split('=')[1];
					console.log(qrSourceId,"qrSourceId")
					app.QrcodeSource(qrSourceId).then(qrinfo=>{
						console.log(qrinfo,'小程序码分享码');
						inviteId = qrinfo.uid;
						store_id = qrinfo.sourceId;
						that.inviteId = inviteId;
						that.store_id = store_id;
						that.isTimeLimit=options.isTimeLimit;
						that.getDetail(store_id, that.location);
						that.LoginInvite(login);
					})
				}else{
					inviteId = null;
					store_id = options.store_id;
					that.inviteId = inviteId;
					that.store_id = store_id;
					that.isTimeLimit=options.isTimeLimit;
					that.getDetail(store_id, that.location);
					that.LoginInvite(login);
					
					if(options.order_id){
						that.prductOrderId=options.order_id
						that.productOrderData(options.order_id);
					}
					
					
				}
			})
		},
		
		onShow(){
			let that = this;
			that.mineInfo = uni.getStorageSync('mineInfo');
			if(that.store_id){
				const params = {
					store_id:  that.store_id,
					location: that.location,
				}
				app.httpRequest({
					url:app.globalData.api.store.StoreDetail,
					data:params,
				}).then( res => {
					let rep = /[\.]/;
					if(rep.test(res.score)){
						res.score = Math.floor(res.score *100)/100;
					}else {
						res.score = res.score + '.0';
					}
					that.store = res;
				})
			}else {
				return;
			}
		},
		
		onPullDownRefresh(){
			let that = this;
			uni.showToast({
				title:'刷新中',
				icon:"loading",
				mask:true
			})
			setTimeout(() => {
				that.page = 1;
				that.shopPage = 1;
				that.commentList = [];
				that.shopList = [];
				that.getDetail(that.store_id, that.location);
				app.getUserInfo(function(lRes){
					that.mineInfo = lRes;
					that.btnText = lRes.vip_level>0?'立即预约':'开通会员';
				})
				uni.hideNavigationBarLoading() //完成停止加载
				uni.stopPullDownRefresh() //停止下拉刷新
				uni.hideToast();
			},1500);
		},	
		
		methods: {
			openMaskAuction(item){
				// item 拿时间信息
				this.auctionInfo=item
				this.maskAuction=true
			},
			//跳转去抢购
			goLook(index,id){
				if(index==1){
					uni.navigateTo({
						url:'/pageE/auctionList/auctionList'
					});
				}else{
					uni.navigateTo({
						url:`/pageE/auctionDetail/auctionDetail?id=${id}`
					});
				}
			},
			openbalance(){
				this.isBalance=true
			},
			closebalance(){
				this.isBalance=false
				this.maskAuction=false
			},
			// 领取红包
			drawRedPacket(item){
				this.redPacketData=item
				this.modalPacket=true
			},
			closeOpenRedPacket(){
				this.modalPacket=false
			},
			// 点击开红包
			openRedPacket(){
				// redEvenlopeOpen
				this.modalPacket=false
				uni.navigateTo({
					url: `/pageD/redPacket/redPacket?id=${this.store.store_id}&redPacketId=${this.redPacketData.id}`
				});
				
			},
			// 获取当前卡是否可以显示
			productOrderData(orderId){
				productOrderUseInfo({id:orderId}).then(res=>{
					// this.prductInfo=res.data
					if(res.data.status==0){
						this.modalFree=true
					}else{
						this.modalFree=false
					}
				})
			},
			// 领取免单券
			getFreeCard(){
				let data = {
					id: this.prductOrderId,
					type: 3,
				}
				productOrderuse(data).then(res=>{
					this.modalFree=false
					if(res.code==200){
						uni.showToast({
							title:'使用成功',
							icon:'none'
						})
					}
					
				})
				
			},
			jumpPageD(){
				uni.navigateTo({
					url: `/pageD/shopGood/shopGood?id=${this.store.store_id}`
				});
			},
			jumpPageC() {
				console.log(this.inputPay,"",this.store.store_id)
				uni.navigateTo({
					url: `/pageC/payDetail/payDetail?amount=${this.inputPay}&storeId=${this.store.store_id}`
				});
				this.modalFlag = false;
			},
			payBill(){
				this.modalFlag = true;
			},
			// 关闭弹窗
			closeModal() {
				this.modalFlag = false;
			},
			onKeyInputPr(event) {
			  this.inputPay = event.target.value
				const value = event.target.value;
				      const regex = /^(\d+)?(\.\d{1,2})?$/;
				      if (!regex.test(value)) {
								console.log("9",this.inputValue)
				        // 如果输入值不符合正则表达式，则设置为上一个合法的值
				        this.inputValue = this.inputValue;
				      } else {
								console.log("2")
								console.log(value,"value")
				        this.inputValue = value;
				      }
			},
			phoneClick(){
				uni.makePhoneCall({
					phoneNumber: this.store.phone,
					success: function () {
					console.log("拨打电话成功！")
					},
					fail: function () {
					console.log("拨打电话失败！")
					}
				});
			},
			clickNav(index){
				this.xinShopIndex=index
			},
			showCouponTip(){
				this.showCoupon = !this.showCoupon
			},
			loadmore(){
				if(this.store.members_interests.length==2){
					this.scrollLeft = this.old.scrollLeft
					this.$nextTick(() => {
					    this.scrollLeft = 0;
					});
					console.log(333)
				}
			},
			scrollP(e) {
				console.log(e)
			  this.old.scrollLeft = e.detail.scrollLeft;
			},
			payGoods:gongType.debounce(function (e){
				
				let itemA=this.xinShopList[this.xinShopIndex]
				console.log(itemA,"itemA")
				let xiuXianSaleId = uni.getStorageSync('xiuXianSaleId');
				
				let that = this;
				http.post('/api/order/v1/goods/buy',{
					id:itemA.type==2?that.shopList[0].id:'2',
					type:1,
					saleId:xiuXianSaleId?xiuXianSaleId:''
				}).then( payment => {
					switch(payment.code){
						case 200:
						app.WxPayMent(payment.data).then( res=> {
							app.getUserInfo(function(lRes){
									that.mineInfo = lRes;
									that.btnText = lRes.vip_level>0?'立即预约':'开通会员';
							})
						})
					 break;
					 default:
						uni.showToast({
							title:payment.message,
							icon:'none'
						})
					 break;
					}
				})
			}, 1000),
			// 更多评论
			JumpMoreComment(id){
				uni.navigateTo({
					url:'/pages/commentsList/commentsList?id='+id + '&type=booking'
				})
			},
			LoginInvite(login){
				let that = this;
				let inviteId = that.inviteId;
				that.mineInfo = login;
				that.btnText = login.vip_level>0?'立即预约':'开通会员';
				if(inviteId){
					app.isLogin({id:inviteId},function(res){
						that.mineInfo = res;
					});
				}
			},
			// 返回按钮
			tapToBack(page) {
				switch(page){
					case 'index':
						uni.switchTab({
							url:'../index/index'
						})
					break;
					case 'back':
						uni.navigateBack({
							delta:1,
							fail() {
								uni.switchTab({
									url:'../index/index'
								})
							}
						})
					break;
				}
			},
			// 商户详情
			showShopDetail(){
				this.shopDetailflag=true;
			},
			// 接入微信客服
			WeixinServer(){
				console.log("打开客服")
				wx.openCustomerServiceChat({
					extInfo: {
						url: 'https://work.weixin.qq.com/kf/' + "kfc11f5184d7762c658"
					},
					 corpId: 'ww106853c8ad050781',
				})
			},
			// 手机号授权
			onGetPhoneNumber(e){
				let that = this;
				app.GetMobile(e,function(e){
					// that.phoneLoginFlag = true;
					if(that.inviteId !==''){
						app.isLogin({id:that.inviteId},function(login){
							that.mineInfo = login;
							that.toBooking();
						});
					}else {
						app.getUserInfo(function(lRes){
							that.mineInfo = lRes;
							that.toBooking();
						})
					}
				});
			},
			// 手机号授权
			// onGetPhoneNumberT(e){
			// 	console.log(e,"eeeee")
			// 	let that = this;
			// 	app.GetMobile(e,function(e){
			// 		// that.phoneLoginFlag = true;
			// 		if(that.inviteId !==''){
			// 			app.isLogin({id:that.inviteId},function(login){
			// 				that.mineInfo = login;
							
			// 			});
			// 		}else {
			// 			app.getUserInfo(function(lRes){
			// 				that.mineInfo = lRes;
							
			// 			})
			// 		}
			// 	});
			// },
			// 用户地图
			MapDirection(){
				let that = this;
				qqmapsdk.direction({
					mode:'walking',
					tags:['LEAST_TIME'],
					from:{
						latitude:app.globalData.latitude,
						longitude:app.globalData.longitude
					},
					to:{
						latitude:that.store.location.split(',')[0],
						longitude:that.store.location.split(',')[1]
					},
					success(loc) {
						console.log(loc,"loc")
						that.mapDuration = loc.result.routes[0].duration;
					}
				})
			},
			// 商户用户评论
			getComment(){
				let that = this;
				let par = {
					page:that.page,
					pageSize:that.pageSize,
					businessId:that.store.store_id
				}
				app.httpRequest({
					url:app.globalData.api.store.GetUserComment,
					data : par
				}).then(list => {
					switch(list.code){
						case 200:
							that.isLastPage = list.data.is_last_page;
							that.totalCommentCount = list.data.total_count;
							if(list.data.data && list.data.data.length>0){
								if(that.page == 1 && that.navList == null){
									that.curNav = '会员评价';
									that.navList = [
										{ name: '会员评价', id: 1004},
										{ name: '注意事项', id: 1003}
									];
								}
								for (var i = 0; i < list.data.data.length; i++) {
									list.data.data[i].commentTime = list.data.data[i].commentTime.split(' ')[0]
									// list.data.data[i].commentTime = list.data.data[i].commentTime.slice(5,16)
									if( list.data.data[i].commentImages && list.data.data[i].commentImages.length>0){
										for (var j = 0; j < list.data.data[i].commentImages.length; j++) {
											list.data.data[i].commentImages[j] = list.data.data[i].commentImages[j].replace ('hesen-gfn-public.oss-cn-shenzhen.aliyuncs.com','imgs.ynz666.com');
										}
									}
								};
								that.commentList = that.commentList.concat(list.data.data);
							}else{
								that.commentList = null;
								if(that.page == 1 && that.navList == null){
									that.curNav = '注意事项';
									that.navList = [
										{ name: '注意事项', id: 1004},
										{ name: '会员评价', id: 1003},
									]
								}
							}
						break
						default:
							that.isLastPage = true;
							that.commentList = null;
							if(that.page == 1 && that.navList == null){
								that.curNav = '注意事项';
								that.navList = [
									{ name: '注意事项', id: 1004},
									{ name: '会员评价', id: 1003},
								]
							}
						break;
					}
				})
			},
			// 获取商家详情
			getDetail(s_id, location) {
				var that = this
				// uni.showLoading();
				const params = {
					store_id:  s_id,
					location: location,
				}
				
				app.httpRequest({
					url:app.globalData.api.store.StoreDetail,
					data:params,
				}).then( res => {
					console.log(res,'商户详情')
					let rep = /[\.]/;
					if(rep.test(res.score)){
						res.score = Math.floor(res.score *100)/100;
					}else {
						res.score = res.score + '.0';
					}
					that.store = res;
					
					
					that.auctionList=res.auctionList
					
					// console.log(res.auctionList[0].openTime.split(' ')[0],"000000")
					
					// 完成进
					
					if(that.store.hasOrder){
						this.hasOrder=true
						this.xinShopList=[
							{
								money:'499.0',
								time:'30天',
								validity:'每天可用5次',
								text:'95%的会员的选择',
								type:2
							}
						]
					}else{
						this.hasOrder=false
					}
					
					// that.btnTextTow=res.isBussiness?'出示二维码':'商户已打烊'
					that.getComment();
					that.shopGroupList(); // 获取购买商品列表
					that.MapDirection();
					uni.hideLoading();
					uni.setNavigationBarTitle({
						title:res.name
					})
				}).catch(err=>{
					uni.showToast({
						title:err.message?err.message:'获取商家信息失败',
						icon:'none',
						success() {
							setTimeout(function(){
								uni.switchTab({
									url:'/pages/index/index'
								})
							},2000)
						}
					})
				});
			},
			// 打开地图 
			openMap() {
				Map.openMap( Number(this.store.location.split(',')[0]),Number(this.store.location.split(',')[1]), this.store.address, "gcj02");//wgs84
			},
			// 立即预约
			
			toBooking: gongType.debounce(function (e){
				let that = this;
				that.isBalance=false
				let mineInfo = that.mineInfo;
				console.log( mineInfo," mineInfo mineInfo mineInfo")
				if(mineInfo.phone && mineInfo.phone.length == 11) {
					if(that.inviteId!=='' && mineInfo.vip_level<=0){
						app.isLogin({id:that.inviteId},function(login){});
					}
					if(mineInfo.vip_level<=0&&mineInfo.balance==0){
						// 不是会员
						let saleId =  uni.getStorageSync('xiuXianSaleId');
						if(saleId) {
							uni.navigateTo({
								url:'../buy/buy?businessId='+ that.store.store_id + '&saleId=' +saleId + '&hasOrder=' + that.store.hasOrder
							})
						}else {
							uni.navigateTo({
								url:'../buy/buy?businessId='+ that.store.store_id + '&hasOrder=' + that.store.hasOrder
							})
						}
					}else{
						wx.requestSubscribeMessage({
							tmplIds: ['fqVER7fWm9y3RyxIt7I1I_7rslxsT5cigzhqRpnQpg4'],
							complete() {
								switch(that.store.isAppointment) {
									case true:
									  console.log(111);
										uni.navigateTo({
											url:'../reservation/reservation?store_id='+that.store_id+'&&location='+ that.location
										})
									break;
									default:
										http.post('/api/store/v1/appointment/addNow',
										{
											businessId:that.store.store_id
										}).then( res => {
											switch (res.code){
												case 200:
													// uni.navigateTo({
													// 	url:'../orderResult/orderResult?orderId=' + res.data.id
													// })
													uni.switchTab({
														url:'../writeList/writeList'
													})
												break;
												default:
												
													uni.showToast({
														icon:'none',
														title:res.message
													})
													// uni.switchTab({
													// 	url:'../writeList/writeList'
													// })
												break;
											}
										}).catch(err=>{
											console.error(err,'errerererer')
										})
									break;
								}
							}
						})
					}
				}
			}, 1000),
			//  获取商品列表
			shopGroupList(){
				let that = this;
				GetGoodsList({
					page:that.shopPage,
					pageSize:that.shopPageSize,
					businessId:that.store.store_id,
					goodsType:2,
				}).then( list => {
					switch(list.code){
						case 200:
							that.shopLastPage = list.data.is_last_page;
							// that.moreTip = list.data.data.length>2?'+展开看看':'没有更多商品了';
							if(list.data.data && list.data.data.length>0){
								that.shopList = that.shopList.concat(list.data.data);
								// uni.setStorageSync('shopList',that.shopList);
							}
						break;
						default:
							uni.showToast({
								title:list.message,
								icon:"none"
							})
						break;
					}
				})
			},
			// 点开展示更多商品列表
			showMoreShop(){
				if(this.shopList.length>2){
					this.showGoodsFlag = !this.showGoodsFlag;
					this.moreTip = this.showGoodsFlag?'收起':'+展开看看'
				}
				// if(!this.shopLastPage){
				// 	this.shopPage ++;
				// 	this.shopGroupList();
				// }else{
				// 	this.moreTip = '没有更多商品了'
				// }
			},
			// 购买详情
			jumpPage(id){
				uni.navigateTo({
					url:'../groupDetail/groupDetail?id=' + id
				})
			},
			jumpVoucher(id){
				// uni.navigateTo({
				// 	url:`../voucher/voucher?id=${id}`
				// })
				uni.navigateTo({
					url:`/pageB/groupDetail/groupDetail?id=${id}&storeId=${this.store_id}&type=2`
				})
			},
			// 评论图片预览
			imagePreview(index,imgArr){
				uni.previewImage({
					urls:imgArr,
					current:imgArr[index],
				})
			},
		},
		
		onShareAppMessage(res) {
			let shareTips = '邀请你和我一起来' + this.store.name;
			if(this.mineInfo.nick_name.indexOf('Gfner')<0){//授权过头像
				return {
					title:shareTips,
					imageUrl : '',
					//this.store.thumb_img
					path:'/pages/storeDetail/storeDetail?store_id='+ this.store_id + '&inviteId='+ this.mineInfo.id + '&shopId='+ this.shopList[0].id
				}
			}else {
				return {
					title:shareTips,
					imageUrl : '',
					path:'/pages/storeDetail/storeDetail?store_id='+ this.store_id + '&shopId='+ this.shopList[0].id
				}
			}
		},
		
		onReachBottom() {
			if(!this.isLastPage && this.curNav == 1003){
				this.page++;
				this.getComment();
			}
		},
	}
</script>
<style>
	page {
		background: #F4F6FA;
	}
</style>
<style lang="scss" sc>
	page{
		background: #F4F4F4;
	}
.top-box {
	position: fixed;
	top: 0;left: 0;
	width: 100vw;
	z-index: 10;
	background: #fff;
}

.main1{
	width: 650rpx;
	// height: 300rpx;
	border-radius: 64rpx;
	background: #fff;
	padding: 30rpx 30rpx 50rpx;
	margin-bottom: 20rpx;
	margin-top: -100rpx;
	.main_top{
		padding: 20rpx 0 0;
		margin: 0 30rpx;
		display: flex;
		justify-content: center;
		text-align: center;
		font-weight: 700;
		font-size: 36rpx;
		line-height: 44rpx;
		color: #000000;
		
	}
	.main_content{
		margin: 32rpx 4rpx 0;
		height: 68rpx;
		
		// background: #F4F4F4;
		background: #fff;
		border-radius: 16rpx;
		display: flex;
		align-items: center;
		width: 642rpx;
		overflow: hidden;
		.con_left{
			// background: #F4F4F4;
			height: 68rpx;
			display: flex;
			align-items: center;
			border-radius: 16rpx 0 0 16rpx;
			z-index: 10;
			.img{
				width: 38rpx;
				height: 36rpx;
				padding: 0 10rpx 0 22rpx;
			}
		}
		.con_right{
			font-weight: 400;
			font-size: 26rpx;
			color: red;
			width: 554rpx;
			height: 80rpx;
      border-radius: 0 16rpx 16rpx 0;
			display: flex;
			align-items: center;
			overflow: hidden;
			font-weight: bold;
			.con_rightBox{
				width: 554rpx;
				white-space: nowrap;
				// animation: 10s scrolltext linear infinite;
			}
		}
	}
	.main_bottom{
		// border-top: 1rpx solid rgba(239, 239, 239, 0.5);
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding-top: 32rpx;
		.maim_bleft{
			display: flex;
			flex-direction: column;
			flex:1;
		  .view1{
				font-weight: 500;
				font-size: 24rpx;
				color: #000000;
			}
			.view2{
				font-weight: 400;
				font-size: 20rpx;
				color: #666666;
				padding-top: 12rpx;
			}
		}
		.maim_bright{
			display: flex;
			align-items: center;
			padding-left: 12rpx;
			.view1{
				display: flex;
				flex-direction: column;
				align-items: center;
				margin-right: 40rpx;
				.view_box{
					width: 48rpx;
					height: 48rpx;
					background: #F4F4F4;
					border-radius: 50%;
					display: flex;
					align-items: center;
					justify-content: center;
				}
				.img{
					width: 26rpx;
					height: 26rpx;
				}
				.text{
					font-weight: 400;
					font-size: 18rpx;
					color: #666666;
					padding-top: 6rpx;
				}
			}
			.view2{
				display: flex;
				flex-direction: column;
				align-items: center;
				.view_box{
					width: 48rpx;
					height: 48rpx;
					background: #F4F4F4;
					border-radius: 50%;
					display: flex;
					align-items: center;
					justify-content: center;
				}
				.img{
					width: 26rpx;
					height: 26rpx;
				}
				.text{
					font-weight: 400;
					font-size: 18rpx;
					color: #666666;
					padding-top: 6rpx;
				}
			}
		}
	}
}

@keyframes scrolltext{
  0% {
    transform: translateX(100%);
  }

  100% {
    transform: translateX(-100%);
  }
}


.navTopBox {
	display: flex;
	position: relative;
	align-items: center;
	justify-content: center;
	.left-button-box {
		width: 160rpx;
		background-color: rgba(255,255,255,0.5);
		border-radius: 40rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		// margin-left: 30rpx;
		border: 1rpx solid rgba(224, 224, 224, 0.6);
		position: absolute;
		left: 30rpx;
		.line {
			height: 30rpx;
			background: #CCCCCC;
			width: 1rpx;
		}
		
		image {
			width: 30rpx;
			height: 30rpx;
			margin: 0 20rpx;
		}
	}
	.right-button-box{
		font-size: 28rpx;
		font-weight: bold;
	}
	
}
.container {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
	width: 100vw;
}
.store-box {
	background-color: #fff;
	width: 650rpx;
	padding: 30rpx;
	border-radius: 64rpx;
	margin-bottom: 20rpx;
}
.coupon-title {
	font-size: 36rpx;
	font-weight: bold;
	color: #141414;
	display: flex;
	justify-content: space-between;
	align-items: center;
	.down-arrow {
	    display :inline-block;
	    position: relative;
	    width: 40rpx;
	    height: 30rpx;
	    margin-right: 20rpx;
	}
	
	.down-arrow::after {
	    display: inline-block;
	    content: " ";
	    height: 18rpx;
	    width: 18rpx;
	    border-width: 0 2rpx 2rpx 0;
	    border-color: #999999;
	    border-style: solid;
	    transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
	    transform-origin: center;
	    transition: transform .3s;
	    position: absolute;
	    top: 50%;
	    right: 10rpx;
	    margin-top: -10rpx;
	}
	// 加上active旋转成 上箭头
	.down-arrow.active::after {
	    transform-origin: center;
	    transform: rotate(-135deg);
	    transition: transform .3s;
	}
}
// banner
.banner {
	width: 100%;
	height: 600rpx;
	position: relative;
	.swiper{
		height: 600rpx;
	}
	.item{
		position:relative;
		display: block;
		width: 100%;
		height: 600rpx;
		margin: 0 auto;
		overflow: hidden;
	}
	.img {
		display: block;
		width: 100%;
		height: 100%;
	}
}
// 会员
.vip-box {
	width: 670rpx;
	height: 60rpx;
	padding: 20rpx;
	background: #FEF0D5;
	border-radius: 24rpx 24rpx 0 0;
	display: flex;
	position: relative;
	font-size: 24rpx;
	font-weight: bold;
	color: #865A22;
	line-height: 44rpx;
	margin-top: -60rpx;
	
	.vipImg {
		width: 44rpx;
		height: 44rpx;
		margin-right: 4rpx;
	}
	.vip-open {
		position: absolute;
		right: 20rpx;
		display: flex;
		image {
			width: 24rpx;
			margin-top: 10rpx;
			height: 24rpx;
		}
	}
}
// 商家信息
.store-info {
	margin-top: -20rpx;
	z-index: 1;
	// background-color: #fff;
	width: 100%;
	padding: 30rpx 0 0;
	// margin-bottom: 20rpx;
	border-radius: 44rpx 44rpx 0 0;
	// background: linear-gradient(180deg, #FFFFFF 0%, #F4F6FA 100%);
	// height: 200rpx;
}
.store-info-box{
	padding: 0 20rpx;
}
.store-info-name {
	font-size: 36rpx;
	font-weight: bold;
	color: #141414;
	line-height: 50rpx;
	padding: 0 10rpx;
}
.store-info-tags {
	color: #666666;
	line-height: 40rpx;
	margin-top: 8rpx;
	padding: 0 10rpx;
	text {
		font-size: 28rpx;
	}
}
// 商家公告
.store-info-notice {
	display: flex;
	// align-items: center;
	margin-top: 30rpx;
	font-size: 24rpx;
	color: #141414;
	line-height: 32rpx;
	background: #FFCC00;
	border-radius: 12rpx;
	padding: 12rpx;
	image {
		width: 32rpx;height: 32rpx;
		margin-right: 10rpx;
	}
	view {
		width: 650rpx;
		line-height: 32rpx;
	}
}
// 商家权益
.store-info-interests {
	margin-top: 30rpx;
	margin-bottom: 20rpx;
	z-index: 4;
	background: #fff;
	padding: 140rpx 0 30rpx;
	border-radius: 64rpx;
	position: relative;
	width: 710rpx;
}
.store-info-interests-top{
	width: 100%;
	height: 100rpx;
	border-radius: 64rpx 64rpx 0 0;
	background-color:#FA6400;
	position: absolute;
	top: 0;
	left:0;
	font-size: 36rpx;
	font-family: FZLTDHJW--GB1-0, FZLTDHJW--GB1;
	font-weight: bold;
	color: #FFFFFF;
	line-height: 86rpx;
	background: #F43B00;
	display: flex;
	align-items: center;
	justify-content: space-between;
	.view_left{
		padding-left: 30rpx;
		font-weight: 700;
		font-size: 32rpx;
	}
	.view_right{
		padding-right: 30rpx;
		font-weight: 400;
		font-size: 24rpx;
		color: #FFFFFF;
		opacity: 0.8;
	}
	image {
		width: 100%;
		height: 86rpx;
		display: block;
	}
}
.scroll-view,.scroll-view-goods {
	overflow-x: hidden!important;
	// white-space: nowrap;
	display: flex;
	// width: 680rpx;
	
}
.scroll-view{
	height: 280rpx;
}
.scroll-item {
	border-radius: 16rpx;
	// border: 1rpx solid #EFEFEF;
	position: relative;
	display: inline-block;
	margin-bottom: 10rpx;
	// padding: 28rpx 20rpx 20rpx 20rpx;
	// width: 100%;
	margin-bottom: 30rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding:0 30rpx;
	.scroll-vip-thumb {
		width: 100rpx;
		height: 100rpx;
		border-radius: 12rpx;
		margin-right: 20rpx;
	}
	.scroll-vip {
		width: 120rpx;
		height: 46rpx;
		display: block;
		position: absolute;top: 0;right: 0;
	}
	.btnAll{
		width: 108rpx;
		height: 56rpx;
		position: relative;
		button{
			width: 100%;
			height: 100%;
			position: absolute;
			top: 0;
			left: 0;
			opacity: 0;
		}
	}
	.scroll_right{
		width: 108rpx;
		height: 56rpx;
		background: linear-gradient( 310deg, #F43B00 0%, #FA6D00 100%);
		border-radius: 28rpx;
		font-size: 26rpx;
		color: #FFFFFF;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.scroll_right_two{
		width: 108rpx;
		height: 56rpx;
		background:#a8a7a7;
		color: #fff;
		border-radius: 28rpx;
		font-size: 26rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}
}
.scroll-item-bottom{
	display: flex;
	position: relative;
	width: 100%;
	align-items: center;
	.item-bottom_left{
		width: 20rpx;
		height: 40rpx;
		background-color: #F4F6FA;
		border-radius: 0 40rpx 40rpx 0;
		position: absolute;
		left: 0;
	}
	.item-bottom_center{
		width: 100%;
		margin: 30rpx 0 20rpx;
		.center-xian{
			width: 610rpx;
			border-top: 1px dashed #EFEFEF;
			margin: auto;
		}
	}
	.item-bottom_right{
		width: 20rpx;
		height: 40rpx;
		background-color: #F4F6FA;
		border-radius: 0 40rpx 40rpx 0;
		position: absolute;
		right: 0;
		transform: rotate(180deg);
	}
}
.scroll-item-right {
	display: flex;
	flex-direction: column;
	flex: 1;
	.view1{
		font-size: 28rpx;
		font-weight: bold;
		color: #333333;
		line-height: 40rpx;
		margin: 10rpx 0 6rpx;
		// word-break: break-all;
		// white-space:pre-wrap;
		// word-wrap: break-word;
		// overflow: hidden;
		// display: -webkit-box;
		// text-overflow: ellipsis;
		// -webkit-box-orient: vertical;
		// -webkit-line-clamp: 1;
	}
	.view2{
		margin-top: 4rpx;
		font-size: 24rpx;
		color: #999999;
		animation-play-state: 8rpx;
		line-height: 33rpx;
		word-break: break-all;
		white-space:pre-wrap;
		word-wrap: break-word;
		overflow: hidden;
		display: -webkit-box;
		text-overflow: ellipsis;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 1;
		color:rgba(244, 59, 0, 1);
		display: flex;
		align-items: center;
		.useNum{
			min-width: 40rpx;
			height: 22rpx;
			background: rgba(244, 59, 0, 0.1);
			border: 1rpx solid #F43B00;
			border-radius: 4rpx;
			font-weight: 400;
			font-size: 16rpx;
			color: #F43B00;
			display: flex;
			align-items: center;
			justify-content: center;
			margin-left: 20rpx;
			padding: 4rpx 10rpx 0;
		}
	}
}

// 抢购商品
.auctionGood{
	padding:0 30rpx;
	.aucItem{
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-bottom: 30rpx;
		.aut_left{
			display: flex;
			align-items: center;
			flex: 1;
			.left{
				width: 100rpx;
				height: 100rpx;
				border-radius: 12rpx;
			}
			.right{
				display: flex;
				// align-items: flex-end;
				flex-direction: column;
				margin-left: 20rpx;
				flex: 1;
				// .rig_view1{
					.rig_top{
						font-weight: 400;
						font-size: 24rpx;
						color: #333333;
						white-space: nowrap;
						overflow: hidden;
						text-overflow: ellipsis;
						width: 350rpx;
					}
					.rig_bot{
						display: flex;
						align-content: center;
						padding-top: 10rpx;
						.bot_view1{
							font-weight: 400;
							font-size: 24rpx;
							color: #F43D02;
							
						}
						.bot_view2{
							font-weight: 400;
							font-size: 22rpx;
							color: #999999;
							padding-left: 22rpx;
						}
					}
				// }
				// .rig_view2{
				// 	font-weight: 400;
				// 	font-size: 22rpx;
				// 	color: #999999;
				// 	padding-left: 22rpx;
				// }
			}
		}
		.aut_right{
			width: 145rpx;
			height: 54rpx;
			background: linear-gradient( 310deg, #F43B00 0%, #FA6D00 100%);
			border-radius: 28rpx;
			font-weight: bold;
			font-size: 26rpx;
			color: #FFFFFF;
			display: flex;
			align-items: center;
			justify-content: center;
			border: 2rpx solid #F54100;
		}
		.aut_rightTwo{
			width: 145rpx;
			height: 54rpx;
			border-radius: 28rpx;
			font-weight: bold;
			font-size: 26rpx;
			color: #F54100;
			display: flex;
			align-items: center;
			justify-content: center;
			border: 2rpx solid #F54100;
		}
	}
}


// 商家地址
.store-address {
	display: flex;
	justify-content: space-between;
	align-items: center;
	background: url('https://hesen-gfn-public.oss-cn-shenzhen.aliyuncs.com/default/storeDetail-mapback.png');
	background-repeat: no-repeat;
	background-size: 100% 100%;
	padding: 35rpx 30rpx;
}
.store-address-detail {
	font-size: 28rpx;
	max-width: 500rpx;
	.store-address-name {
		font-weight: bold;
		color: #333333;
		line-height: 40rpx;
	}
	.store-address-time {
		color: #999999;
		line-height: 40rpx;
		margin-top: 10rpx;
	}
}
.store-address-image {
	width: 100rpx;
	height: 100rpx;
	border-radius: 50%;
	background: #141414;
	image {
		width: 36rpx;height: 36rpx;
		margin-top: 32rpx;
		margin-left: 32rpx;
	}
}
// 团购
.store-goods {
	.store-goods-title {
		display: flex;
		align-items: center;
		position: relative;
		margin-bottom: 30rpx;
		image {
			width: 50rpx;
			height: 50rpx;
			margin-right: 10rpx;
		}
		.store-goods-title-txt {
			line-height: 50rpx;
			font-size: 36rpx;
			font-weight: bold;
			color: #141414;
		}
		.store-goods-tips {
			font-size: 24rpx;
			color: #999999;
			position: absolute;right: 0;
		}
	}
}
.store-goods-list {
	.store-goods-item {
		width: 220rpx;
		background: #FFFFFF;
		border-radius: 12rpx;
		border: 1rpx solid #F4F4F4;
		display: inline-block;
		margin-right: 20rpx;
		
		image {
			width: 220rpx;
			height: 220rpx;
			display: block;
			border-radius:12rpx 12rpx 0 0;
		}
		.store-goods-name {
			font-size: 28rpx;
			color: #141414;
			margin: 10rpx 0 0 10rpx;
			line-height: 40rpx;
			
		}
		.store-goods-price {
			font-size: 24rpx;
			margin: 4rpx 0 0 10rpx;
			font-size: 24rpx;
			font-weight: bold;
			line-height: 33rpx;
			padding-bottom:18rpx;
			display: flex;
			justify-content: space-between;
			text:nth-child(1){
				color: #999999;
			}
			text:nth-child(2){
				color: #FF453A;
				margin-left: 8rpx;
				font-size: 32rpx;
			}
		}
	}
}


// 红包
.redPacket{
	width: 650rpx;
	border-radius: 64rpx;
	background: #fff;
	padding: 30rpx;
	margin-bottom: 20rpx;
	.redPacket_top{
		font-size: 36rpx;
		font-weight: bold;
		color: #141414;
		padding-bottom: 30rpx;
	}
	.redPacket_bot{
		display: -webkit-box;
		align-items: center;
		overflow-x: auto;
		.item{
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			margin-right: 80rpx;
			.img{
				width: 100rpx;
				height: 100rpx;
			}
			.name{
				font-size: 26rpx;
				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				color: #F43B00;
				margin-top: 10rpx;
			}
		}
		.item2{
			.name{
				color: #333333;
			}
		}
		.item3{
			.name{
				color: #999999;
			}
		}
	}
	.redPacket_bot {
		::v-deep::-webkit-scrollbar {
			display: none;
		}
	}
}

// 超值团购
.group{
	  width: 650rpx;
		border-radius: 64rpx;
		background: #fff;
		padding: 30rpx 30rpx 10rpx;
		margin-bottom: 20rpx;
		.group_top{
			font-size: 36rpx;
			font-weight: bold;
			color: #141414;
			padding-bottom: 30rpx;
		}
		.group_bottom{
			.item{
				margin-bottom: 40rpx;
				
				.item_bottom{
					display: flex;
					align-items: center;
					justify-content: space-between;
					.item_top{
						color: #333333;
						font-weight: 500;
						font-size: 28rpx;
						margin-bottom: 12rpx;
					}
					.b_left{
						flex: 1;
						.view1{
							font-weight: 400;
							font-size: 22rpx;
							color: #666666;
						}
						.view2{
							color: #F43B00;
							font-weight: 700;
							font-size: 24rpx;
							margin-top: 10rpx;
							display: flex;
							align-items: center;
							.zk{
								color: #F43B00;
								font-weight: 400;
								font-size: 18rpx;
								border: 1rpx solid #F43B00;
								border-radius: 8rpx;
								padding: 0 4rpx;
								margin-left: 10rpx;
							}
						}
					}
					.b_right{
						margin-left: 100rpx;
						display: flex;
						flex-direction: column;
						align-items:center;
						justify-content: center;
						position: relative;
						button{
							    width: 100%;
							    height: 100%;
							    position: absolute;
							    top: 0;
							    left: 0;
							    opacity: 0;
						}
						.view1{
							width: 140rpx;
							height: 60rpx;
							color: #FFFFFF;
							font-weight: 700;
							font-size: 24rpx;
							display: flex;
			        align-items: center;
							justify-content: center;
							background: #F43B00;
							border-radius: 100rpx;
						}
						.view2{
							color: #999999;
							font-weight: 400;
							font-size: 20rpx;
							margin-top: 10rpx;
						}
					}
					.b_rightTow{
						.packet_view1{
							display: flex;
							position: relative;
							.img{
								width: 98rpx;
								height: 98rpx;
							}
							.v1_box{
								width: 98rpx;
								height: 98rpx;
								display: flex;
								align-items: center;
								justify-content: center;
								font-size: 30rpx;
								font-family: PingFangSC, PingFang SC;
								font-weight: 600;
								color: #F43B00;
								position: absolute;
							}
						}
						.packet_view2{
							width: 200rpx;
							height: 78rpx;
							background: linear-gradient(302deg, #F43B00 0%, #FA6D00 100%);
							border-radius: 39rpx;
							font-size: 28rpx;
							font-family: PingFangSC, PingFang SC;
							font-weight: 600;
							color: #FFFFFF;
							display: flex;
							align-items: center;
							justify-content: center;
						}
					}
				}
			}
		}
}

.superCon{
	width: 650rpx;
	border-radius: 64rpx;
	background: #fff;
	padding: 30rpx 30rpx 30rpx;
	margin-bottom: 20rpx;
	.top{
		display: flex;
		align-items: center;
		justify-content: space-between;
		.top_left{
			font-size: 36rpx;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: bold;
			color: #333333;
		}
		.top_right{
			font-size: 24rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #999999;
		}
	}
	.bottom{
		margin-top: 30rpx;
		display: flex;
		align-items: center;
		.scroll-view-goods{
			display: flex;
			align-items: center;
		}
		// justify-content: space-around;
		.item{
			width: 180rpx;
			display: inline-block;
			// display: flex;
			// flex-direction: column;
			// align-items: center;
			// justify-content: center;
			margin-right: 20rpx;
			.item_img{
				width: 143rpx;
				height: 143rpx;
				border-radius: 6rpx;
			}
			.name{
				margin-top: 8rpx;
				font-size: 24rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #333333;
			}
			.price{
				margin-top: 2rpx;
				width: 100rpx;
				height: 36rpx;
				background: linear-gradient(321deg, #F43B00 0%, #FA6D00 100%);
				border-radius: 18rpx;
				font-size: 16rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #FFFFFF;
				display: flex;
				align-items: center;
				justify-content: center;
			}
		}
	}
}


// 用户评价
.store-comment {
	.store-comment-title {
		display: flex;
		align-items: center;
		position: relative;
		margin-bottom: 30rpx;
		.store-comment-txt {
			font-size: 36rpx;
			font-weight: bold;
			color: #141414;
			text {
				margin-left: 10rpx;
				font-size: 28rpx;
				color: #999999;
			}
		}
		.store-comment-more {
			display: flex;
			align-items: center;
			position: absolute;
			right: 0;
			font-size: 24rpx;
			color: #999999;
			image {
				width: 24rpx;
				height: 24rpx;
			}
		}
	}
}
.user_comment {
	width: 650rpx;
	margin: 0 auto;
	.user_comment_item {
		width: 100%;
		border-bottom: 1rpx solid #EFEFEF;
		padding:40rpx 0;
		.user_comment_title {
			display: flex;
			.user_comment_avatar {
				width: 80rpx;
				display: block;
				height: 80rpx;
				margin-right: 12rpx;
				border-radius: 50%;
			}
			.name {
				font-size: 28rpx;
				font-weight: bold;
				color: #333333;
				line-height: 40rpx;
			}
			.date {
				font-size: 24rpx;
				color: #999999;
				line-height: 33rpx;
			}
		}
		.user_content{
			margin: 20rpx 0;
			font-size: 28rpx;
			color: #333333;
			line-height: 40rpx;
		}
		.user_comment_image {
			image {
				width: 155rpx;
				height: 155rpx;
				border-radius: 8rpx;
				margin-right: 10rpx;
			}
			image:last-child {
				margin-right: 0!important;
			}
		}
	}
	.user_comment_item:first-child{
		padding-top: 0;
	}
	.user_comment_item:last-child{
		border-bottom: none;
		padding-bottom: 0;
	}
}
// 
.equi-box {
	.base-title {
		font-size: 36rpx;
		font-weight: bold;
		color: #141414;
		line-height: 50rpx;
	}
	.base-title-os {
		font-size: 28rpx;
		color: #333333;
	}
	.base-list-box {
		font-size: 24rpx;
		color: #999999;
		line-height: 40rpx;
		margin-bottom: 30rpx;
	}
	.base-list-box:last-child {
		margin-bottom: 0;
	}
}
// 底部按钮
.detail-bottom-box {
	background: #fff;
	display: flex;
	align-items: center;
	
	width: 100vw;
	position:fixed;
	bottom: 0;
	left:0;
	padding-top: 25rpx;
	z-index: 5;
	.detail-btn {
		text-align: center;
		margin-left: 50rpx;
		margin-right: 60rpx;
		font-size: 24rpx;
		color: #999999;
		
		image {
			width: 68rpx;
			height: 68rpx;
			margin-top: 10rpx;
		}
	}
	.detail-res-btn {
		width: 524rpx;
		height: 100rpx;
		border-radius: 64rpx;
		background: #FA6400;
		font-size: 36rpx!important;
		text-align: center;
		line-height: 100rpx;
		font-weight: bold;
		color: #fff;
	}
	.gray {
		background: #6D7278;
	}
	.detail-res-hover {
		background: rgba(250, 100, 0, 0.9);
	}
}

	.detail-nomral-btn {
		display: flex;
		flex-direction: column;
		justify-content: center;
		position: relative;
		
		width: 500rpx;
		height: 128rpx;
		border-radius: 64rpx;
		background: #FA6400;
		text-align: center;
		color: #fff;
		
		view:nth-child(1){
			font-size: 36rpx;
			font-weight: bold;
			line-height: 50rpx;
		}
		view:nth-child(2){
			font-size: 24rpx;
			color: #FFFFFF;
			line-height: 33rpx;
		}
		
		button {
			width: 100%;
			height: 100%;
			position: absolute;
			top: 0;
			left: 0;
			opacity:0;
		}
	}
	
	.mask {
		background: rgba(0, 0, 0, 0.5);
		position: fixed;
		width: 100vw;height: 100vh;
		top: 0;left:0;
		z-index: 8;
	}
	.vip_modal{
		z-index: 9;
	}
	.vip_modal,.login_modal{
		background-color: #FFFFFF;
		margin: 0 auto;
		padding: 60rpx 50rpx;
		color: #333;
		width: 450rpx;
		background: #FFFFFF;
		border-radius: 24rpx;
	
		.vip_modal_title3 {
			width: 264rpx;
			height: 20rpx;
			background: #FA6400;margin: 0 auto;margin-top: -20rpx;margin-bottom: 30rpx;
		}
		.vip_modal_content {
			width: 522rpx;
			font-size: 28rpx;
			line-height: 46rpx;
			color: #333333;
			margin: 0 auto;
			margin-top: 28rpx;
			margin-bottom: 78rpx;
		}
		.vip_modal_btn {
			display: flex;
			margin: 0 auto;
			justify-content: center;
			align-items: center;
			width: 400rpx;
			height: 98rpx;
			background: #FA6400;
			border-radius: 49px;
			font-size: 32rpx;
			font-weight: bold;
			color: #141414;
			line-height: 98rpx;
			image {
				width: 40rpx;
				height: 40rpx;
			}
		}
		.vip-bottom-tip {
			text-align: center;
			font-size: 24rpx;
			color: #999999;
			margin-top: 15rpx;
			line-height: 33rpx;
		}
		.closeImg {
			width: 48rpx;
			height: 48rpx;
			position: absolute;
			bottom: -80rpx;
			left: 50%;
			margin-left: -24rpx;
		}
		.rule-title,.rule-btn {
			font-size: 32rpx;font-weight: bold;
			text-align: center;
		}
		.rule-title {
			margin-bottom: 20rpx;
		}
		.rule-btn {
			margin-top: 40rpx;
		}
	}
	
	.vip_modal{
		// width: 630rpx!important;
		// padding: 10rpx;
		
		position: fixed;
		// top: 90vh;
		// top: 50%;
		// transform: translateY(-50%);
		bottom: -100vh;
		// left: 50%;
		// margin-left: -325rpx;
		
		left: 0;
		padding: 0;
		width: 100%;
		
		
		.vip_border_modal {
			padding: 46rpx 30rpx;
			border-radius: 24rpx;
			// border: 1rpx solid #D48806;
		}
		.vip_modal_title1{
			font-size: 44rpx;
			font-weight: bold;
			color: #141414;
			line-height: 56rpx;
		}
		.vip_modal_title2{
			color: #141414;
			font-size: 28rpx;
			margin-bottom: 60rpx;
		}
		.vip_line {
			display: flex;
			justify-content: space-between;
			align-items: center;
			
			width: 100%;
			font-size: 24rpx;
			color: #141414;
			.line {
				width: 130rpx;
				height: 1rpx;
				border-top: 1rpx dotted #D48806;
			}
			image {
				width: 32rpx;
				height: 32rpx;
			}
		}
		.vip-list {
			display: flex;
			justify-content: space-between;
			
			margin-top: 46rpx;
			text-align: center;
			font-size: 22rpx;
			color: #333333;
			image {
				width: 94rpx;
				height: 94rpx;
				margin-bottom: 12rpx;
			}
		}
		.vip-bottom-btn {
			border-radius: 60rpx;
			width: 498rpx;
			height: 120rpx;
			margin: 0 auto;
			margin-top: 84rpx;
			view:nth-child(2){
				text-decoration:line-through;
			}
		}
		.vip_tip {
			margin: 36rpx 0 28rpx;
			font-size: 24rpx;
			text-align: center;
			color: #666666;
		}
		
		.xin_box_title{
		  .text1{
				font-size: 48rpx;
				font-family: PingFangSC-Semibold, PingFang SC;
				font-weight: bold;
				color: #141414;
			}
			.text2{
				font-size: 28rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #666666;
				padding-top: 5rpx;
			}
		}
		.xin_box_title2{
			width: 100%;
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-top: 42rpx;
			.xin_item{
				width: 330rpx;
				height: 330rpx;
				border-radius: 24rpx;
				.item_top{
					height: 263rpx;
					display: flex;
					flex-direction: column;
					align-items: center;
					justify-content: center;
					border: 4rpx solid #EFEFEF;
					width: 322rpx;
					border-radius: 24rpx 24rpx 0 0;
					border-bottom: none;
					.view1{
						font-size: 68rpx;
						font-family: PingFangSC-Semibold, PingFang SC;
						font-weight: bold;
						color: #141414;
					}
					.view2{
						font-size: 28rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #666666;
						padding: 6rpx 0;
						.text1{
							color: #FA6400;
						}
					}
					.view3{
						font-size: 28rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #FA6400;
					}
				}
				.item_bottom{
					border: 4rpx solid #FA6400;
					display: flex;
					align-items: center;
					justify-content: center;
					width: 322rpx;
					height: 67rpx;
					background: #FA6400;
					border-radius: 0px 0px 24rpx 24rpx;
					font-size: 24rpx;
					font-family: PingFangSC-Semibold, PingFang SC;
					font-weight: 600;
					color: #FFFFFF;
				}
			}
		  .xin_item_active{
				.item_top{
					border: 4rpx solid #FA6400;
					border-bottom: none;
					.view1{
						color: #FA6400;
					}
				}
			}
		
		}
	  .xin_box_title2active{
			justify-content: center;
			.xin_item{
				width: 533rpx;
				.item_top{
					width: 529rpx;
				}
				.item_bottom{
					width: 529rpx;
				}
			}
		}
		.xin_box_btn{
	  	width: 660rpx;
	  	height: 108rpx;
	  	background: #FADB14;
	  	border-radius: 54rpx;
	  	font-size: 32rpx;
	  	font-family: PingFangSC-Semibold, PingFang SC;
	  	font-weight: bold;
	  	color: #333333;
	  	display: flex;
	  	align-items: center;
			margin: 54rpx auto 0;
	    justify-content: center;
	  }
	}
	.login_modal{
		background-color: #FFFFFF;
		padding: 60rpx 50rpx;
		position: absolute;
		color: #333;
		background: #FFFFFF;
		border-radius: 12px;
		text-align: center;
		top: 50%;
		left: 65rpx;
		margin-top: -300rpx;
		width: 520rpx;
		
		.login_modal_title {
			font-size: 44rpx;
			font-weight: bold;
			color: #333333;
			line-height: 62rpx;
			margin-bottom: 23rpx;
		}
		
		.login_modal_content {
			font-size: 32rpx;
			margin: 0 auto;
			width: 400rpx;
			color: #333333;
			line-height: 45rpx;
		}
		
		.login_modal_btn {
			display: flex;
			margin-top: 68rpx;
			justify-content: space-between;
			font-size: 28rpx;
			font-weight: bold;
			color: #333333;
			line-height: 90rpx;
			
			view {
				width: 240rpx;
				height: 90rpx;
				background: #EFEFEF;
				border-radius: 16rpx;
			}
			
			view:nth-child(2){
				background: #FA6400;
			}
		}
	

	}
	
	.vip_modal_active{
		bottom: 0;
		transition: 0.6s;
	}
	
	.vip_modal_old{
		width: 630rpx!important;
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		left: 50%;
		margin-left: -325rpx;
		background: #fff;
		border-radius: 24rpx;
		padding: 10rpx;
		.vip_border_modal {
			padding: 46rpx 30rpx;
			border-radius: 24rpx;
			border: 1rpx solid #D48806;
		}
		.vip_modal_title1{
			font-size: 44rpx;
			font-weight: bold;
			color: #141414;
			line-height: 56rpx;
		}
		.vip_modal_title2{
			color: #141414;
			font-size: 28rpx;
			margin-bottom: 60rpx;
		}
		.vip_line {
			display: flex;
			justify-content: space-between;
			align-items: center;
			
			width: 100%;
			font-size: 24rpx;
			color: #141414;
			.line {
				width: 130rpx;
				height: 1rpx;
				border-top: 1rpx dotted #D48806;
			}
			image {
				width: 32rpx;
				height: 32rpx;
			}
		}
		.vip-list {
			display: flex;
			justify-content: space-between;
			
			margin-top: 46rpx;
			text-align: center;
			font-size: 22rpx;
			color: #333333;
			image {
				width: 94rpx;
				height: 94rpx;
				margin-bottom: 12rpx;
			}
		}
		.vip-bottom-btn {
			border-radius: 60rpx;
			width: 498rpx;
			height: 120rpx;
			margin: 0 auto;
			margin-top: 84rpx;
			view:nth-child(2){
				text-decoration:line-through;
			}
		}
		.vip_tip {
			margin: 36rpx 0 28rpx;
			font-size: 24rpx;
			text-align: center;
			color: #666666;
		}
		
	}



   .detail-foot{
		 height: 120rpx;
		 width: 100%;
		 position: fixed;
		 bottom: 40rpx;
		 z-index: 99;
		 .isopen{
			 margin: 0 20rpx;
			 height: 120rpx;
			 border-radius: 64rpx;
			 .isvip{
				 width: 100%;
				 height: 100%;
				 display: flex;
				 align-items: center;
				 // background: #fff;
				 // box-shadow: 0px 0px 20px rgba(162, 39, 0, 0.4);
				 // .isvip_left{
				 // 		width: 410rpx;
				 // 		height: 100%;
				 // 		background: #fff;
					// 	border-radius: 64rpx 0 0 64rpx;
					// 	display: flex;
					// 	flex-direction: column;
					// 	justify-content: center;
					// 	padding-left: 40rpx;
					// 	.isvip_left_top{
					// 		color: #333333;
					// 		font-size: 28rpx;
					// 		font-weight: 500;
					// 		display: flex;
					// 		align-items: center;
					// 		.vip_text{
					// 			color: #F43B00;
					// 		}
					// 	}
					// 	.isvip_left_bottom{
					// 		font-size: 20rpx;
					// 		color: #999999;
					// 	}
				 // }
				 .isvip_left{
					 width: 220rpx;
					 height: 120rpx;
					 background: #FF9C00;
					 box-shadow: -4rpx 3rpx 29rpx 0rpx rgba(161,39,0,0.5);
					 border-radius: 60rpx 0rpx 0rpx 60rpx;
					 display: flex;
					 align-items: center;
					 justify-content: center;
					 .text1{
						 font-size: 36rpx;
						 font-family: PingFangSC-Medium, PingFang SC;
						 font-weight: 500;
						 color: #FFFFFF;
					 }
				 }
				 .isvip_left_new{
					 width: 100%;
					 border-radius: 60rpx;
				 }
				 .isvip_right{
				 		width: 490rpx;
				 		height: 100%;
						.vip_btn1{
							width: 100%;
							height: 100%;
							background: #F43B00;
							color: #FFFFFF;
							border-radius: 0 64rpx 64rpx 0;
							display: flex;
							flex-direction: column;
							align-items: center;
							justify-content: center;
							.t1{
								font-weight: 700;
								font-size: 32rpx;
							}
							.t2{
								font-size: 24rpx;
								opacity: 0.7;
							}
						}
						.vip_btn2{
							width: 100%;
							height: 100%;
							background:#a8a7a7;
							color: #fff;
							font-weight: 700;
							font-size: 32rpx;
							display: flex;
							align-items: center;
							justify-content: center;
							border-radius: 0 64rpx 64rpx 0;
						}
						.vip_btn3{
							width: 100%;
							height: 100%;
							background: #F43B00;
							color: #FFFFFF;
							font-weight: 700;
							font-size: 32rpx;
							display: flex;
							align-items: center;
							justify-content: center;
							border-radius: 0 64rpx 64rpx 0;
						}
				 }
				 .isvip_rightT{
					 width: 100%;
					 height: 100%;
					 .vip_btn1,.vip_btn2,.vip_btn3{
						 border-radius: 64rpx;
					 }
				 }
			 }
			 .wu_box{
				 display: flex;
				 align-items: center;
				 justify-content: space-between;
				 height: 100%;
			 }
			 .kef{
				 width: 120rpx;
				 height: 120rpx;
				 background: #FFFFFF;
				 box-shadow: -4rpx 3rpx 14rpx 0rpx rgba(161,39,0,0.5);
				 border-radius: 73rpx;
				 display: flex;
				 align-items: center;
				 justify-content: center;
				 .img{
					 width: 48rpx;
				 }
			 }
			 
			 .no_isvip{
			 	 // width: 100%;
				 width: 557rpx;
			 	 height: 100%;
			 	 background: #F43B00;
			 	 box-shadow: 0px 0px 20px rgba(162, 39, 0, 0.4);
			 	 border-radius: 64rpx;
				 display: flex;
				 color: #fff;
				 .isvip_left{
				 					 width: 200rpx;
				 					 height: 120rpx;
				 					 background: #FF9C00;
				 					 box-shadow: -4rpx 3rpx 29rpx 0rpx rgba(161,39,0,0.5);
				 					 border-radius: 60rpx 0rpx 0rpx 60rpx;
				 					 display: flex;
				 					 align-items: center;
				 					 justify-content: center;
				 					 .text1{
				 						 font-size: 36rpx;
				 						 font-family: PingFangSC-Medium, PingFang SC;
				 						 font-weight: 500;
				 						 color: #FFFFFF;
				 					 }
				 }
				 .isvip_leftMd{
				 					 width: 557rpx;
				 					 height: 120rpx;
				 					 background: #FF9C00;
				 					 box-shadow: -4rpx 3rpx 29rpx 0rpx rgba(161,39,0,0.5);
				 					 border-radius: 60rpx;
				 					 display: flex;
				 					 align-items: center;
				 					 justify-content: center;
				 					 .text1{
				 						 font-size: 36rpx;
				 						 font-family: PingFangSC-Medium, PingFang SC;
				 						 font-weight: 500;
				 						 color: #FFFFFF;
				 					 }
				 }
				 .isvip_right{
				 		width: 357rpx;
				 		height: 100%;
						position: relative;
				 						.vip_btn1{
				 							width: 100%;
				 							height: 100%;
				 							background: #F43B00;
				 							color: #FFFFFF;
				 							border-radius: 0 64rpx 64rpx 0;
				 							display: flex;
				 							flex-direction: column;
				 							align-items: center;
				 							justify-content: center;
				 							.t1{
				 								font-weight: 700;
				 								font-size: 32rpx;
				 							}
				 							.t2{
				 								font-size: 24rpx;
				 								opacity: 0.7;
				 							}
				 						}
				 }
				 .isvip_rightT{
				 					 width: 100%;
				 					 height: 100%;
				 					 .vip_btn1,.vip_btn2,.vip_btn3{
				 						 border-radius: 64rpx;
				 					 }
				 }
				 
				 button {
				 	width: 100%;
				 	height: 100%;
				 	position: absolute;
				 	top: 0;
				 	left: 0;
				 	opacity:0;
				 }
			 }
		 }
		 .no_isopen{
			 margin: 0 20rpx;
			 height: 120rpx;
			 background:#a8a7a7;
			 color: #fff;
			 border-radius: 64rpx;
			 display: flex;
			 align-items: center;
			 justify-content: center;
			 font-weight: bold;
			 font-size: 32rpx;
		 }
	 }


// 弹窗
	.maskTow {
		width: 100vw;
		height: 100vh;
		position: fixed;
		left: 0;
		top: 0;
		z-index: 99;
	
		background-color: rgba(0, 0, 0, 0.65);
	
		.rank-modal {
			width: 600rpx;
			padding-bottom: 48rpx;
			position: absolute;
			top: 50%;
			transform: translateY(-60%);
			left: 50%;
			margin-left: -300rpx;
			background: #FFFFFF;
			border-radius: 24rpx;
	
			.closePoster {
				width: 48rpx;
				height: 48rpx;
				position: absolute;
				bottom: -80rpx;
				left: 50%;
				margin-left: -24rpx;
			}
	
			.rank-top {
				width: 600rpx;
				height: 200rpx;
				display: block;
			}
	
			.rank-de {
				padding: 30rpx 30rpx 0 30rpx;
				display: flex;
				font-size: 22rpx;
				color: #999999;
	
				view:nth-child(1) {
					margin-right: 58rpx;
				}
	
				view:nth-child(2) {
					margin-right: 150rpx;
				}
	
				view:nth-child(3) {
					margin-right: 50rpx;
				}
			}
	
			.rank-list {
				padding: 36rpx 30rpx;
	
				.rank-item {
					display: flex;
					align-items: center;
					justify-content: space-between;
					font-size: 24rpx;
					color: #666666;
					margin-bottom: 20rpx;
	
					.rank-no {
						font-size: 24rpx;
						color: #FA6400;
					}
	
					.rank-count {
						width: 50rpx;
					}
	
					.rank-save {
						width: 100rpx;
						text-align: center;
					}
	
					.rank-nick {
						display: flex;
						align-items: center;
						width: 220rpx;
						// margin: 0 60rpx 0 60rpx;
	
						image {
							width: 68rpx;
							height: 68rpx;
							border-radius: 50%;
							margin-right: 10rpx;
						}
	
						text {
							flex: 1;
						}
					}
				}
	
				.rank-item:last-child {
					margin-bottom: 0;
				}
			}
		}
	
		.nomral-modal {
			text-align: center;
			width: 600rpx;
			padding-bottom: 48rpx;
			overflow: hidden;
	
			position: absolute;
			top: 50%;
			transform: translateY(-60%);
			left: 50%;
			margin-left: -300rpx;
			background: #FFFFFF;
			border-radius: 24rpx;
	
			// .bg-top {
			// 	width: 51%;
			// 	height: 165rpx;
			// 	background: #FA6400;
			// 	top: 0;
			// 	border-radius: 0 0 0% 80%;
			// 	position: absolute;
			// 	z-index: -1;
			// }
	
			.left {
				padding: 77rpx 0 0;
				font-size: 26rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #000000;
			}
			.in{
				margin: 56rpx 50rpx 0;
				border-bottom: 1rpx solid rgba(216, 216, 216, 1);
				padding-bottom: 18rpx;
				font-size: 36rpx;
				font-family: PingFangSC-Medium, PingFang SC;
				font-weight: 500;
				color: #F43B00;
			}
	
			.right {
				right: 0;
				border-radius: 0 0 80% 0% !important;
			}
	
			image {
				width: 170rpx;
				height: 170rpx;
				display: block;
				margin: 0 auto;
				margin-top: 54rpx;
				z-index: 1;
				margin-bottom: 14rpx;
			}
	
			.nomral-txt {
				width: 482rpx;
				text-align: center;
				margin: 0 auto;
				font-size: 28rpx;
				font-weight: bold;
				color: #141414;
				line-height: 50rpx;
			}
	
			.modal-btn {
				background-color: rgba(244, 59, 0, 1);
			}
	
			.nomral-title {
				font-size: 28rpx;
				color: #141414;
				line-height: 40rpx;
			}
	
			.nomral-vip {
				font-size: 38rpx;
				font-weight: bold;
				color: #141414;
				line-height: 54rpx;
			}
	
			.nomral-btn {
				width: 491rpx;
				height: 100rpx;
				background: #F43B00;
				border-radius: 60rpx;
				margin: 54rpx auto 20rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				color: #fff;
			}
	
			.nomral-tip {
				text-align: center;
				width: 424rpx;
				margin: 0 auto;
				font-size: 20rpx;
				color: #666666;
				line-height: 28rpx;
				margin-top: 14rpx;
			}
	
			.modalBtnAll {
				margin: 54rpx 30rpx 0;
				display: flex;
				align-items: center;
				justify-content: space-between;
	
				.btnLeft {
					width: 260rpx;
					background-color: #FA6400;
					height: 88rpx;
					border-radius: 44rpx;
					text-align: center;
					color: #fff;
					font-size: 28rpx;
					font-weight: bold;
					color: #FFFFFF;
					line-height: 88rpx;
				}
	
				.btnRight {
					width: 260rpx;
					background-color: #FA6400;
					height: 88rpx;
					border-radius: 44rpx;
					text-align: center;
					color: #fff;
					font-size: 28rpx;
					font-weight: bold;
					color: #FFFFFF;
					line-height: 88rpx;
				}
			}
		}
	}
	// 新用户领取免单
	.maskFour {
		width: 100vw;
		height: 100vh;
		position: fixed;
		left: 0;
		top: 0;
		z-index: 100;
		background-color: rgba(0, 0, 0, 0.65);
	
		.maskFour_box {
			width: 576rpx;
			overflow: hidden;
			position: absolute;
			top: 50%;
			transform: translateY(-60%);
			left: 50%;
			margin-left: -288rpx;
			border-radius: 24rpx;
			display: flex;
			flex-direction: column;
			align-items: center;
			.free_img {
				width: 576rpx;
				height: 453rpx;
			}
			.free_btn{
				width: 345rpx;
				height: 93rpx;
				margin: 8rpx 0 25rpx;
			}
			.free_close{
				width: 42rpx;
				height: 42rpx;
			}
		}
	}
	// 新用户领取免单
	.maskFive {
		width: 100vw;
		height: 100vh;
		position: fixed;
		left: 0;
		top: 0;
		z-index: 100;
		background-color: rgba(0, 0, 0, 0.65);
	
		.maskFour_box {
			width: 600rpx;
			overflow: hidden;
			position: absolute;
			top: 50%;
			transform: translateY(-60%);
			left: 50%;
			margin-left: -288rpx;
			border-radius: 24rpx;
			display: flex;
			flex-direction: column;
			align-items: center;
			.img_box{
				width: 600rpx;
				height: 600rpx;
				position: relative;
				.img_text{
					position: absolute;
					font-size: 88rpx;
					color: #C3721A;
					bottom: 60rpx;
					width: 100%;
					text-align: center;
				}
			}
			.free_img {
				width: 600rpx;
				height: 600rpx;
			}
			.btn{
				width: 100%;
				display: flex;
				align-items: center;
				justify-content: space-around;
				margin-top: 20rpx;
				.btn1{
					width: 250rpx;
					height: 78rpx;
					background: #F0F0F0;
					border-radius: 39rpx;
					font-size: 28rpx;
					color: #333333;
					display: flex;
					align-items: center;
					justify-content: center;
				}
				.btn2{
					width: 250rpx;
					height: 78rpx;
					background: #F43B00FF;
					border-radius: 39rpx;
					font-size: 28rpx;
					color: #FFFFFF;
					display: flex;
					align-items: center;
					justify-content: center;
				}
			}
		}
	}
	// 红包领取弹框 
	.packetMask {
		width: 100vw;
		height: 100vh;
		position: fixed;
		left: 0;
		top: 0;
		z-index: 100;
		background-color: rgba(0, 0, 0, 0.65);
	
		.packetMask_box {
			width: 600rpx;
			// overflow: hidden;
			position: absolute;
			top: 58%;
			transform: translateY(-60%);
			left: 50%;
			margin-left: -300rpx;
			border-radius: 24rpx;
			// background: #fff;
			height: 800rpx;
			.bj_img{
				position: absolute;
				top: 0;
				width: 600rpx;
				height: 800rpx;
				z-index: -1;
			}
			.title{
				width: 100%;
				display: flex;
				align-items: center;
				flex-direction: column;
				justify-content: center;
				padding-top: 70rpx;
				.img{
					width: 160rpx;
					height: 160rpx;
					border-radius: 16rpx;
				}
				.name{
					font-size: 32rpx;
					font-family: PingFangSC, PingFang SC;
					font-weight: 600;
					color: #FFFFFF;
					padding: 40rpx 20rpx;
				}
				.desc{
					font-size: 26rpx;
					font-family: PingFangSC, PingFang SC;
					font-weight: 400;
					color: #FFFFFF;
				}
			}
			.bot{
				width: 100%;
				display: flex;
				align-items: center;
				justify-content: center;
				position: absolute;
				bottom: 100rpx;
				.img{
					width: 196rpx;
					height: 196rpx;
					
				}
			}
			.fot{
				width: 100%;
				display: flex;
				align-items: center;
				justify-content: center;
				position: absolute;
				bottom: -82rpx;
				.img{
					width: 42rpx;
					height: 42rpx;
				}
			}
		}
	}

// 弹窗
	.maskAuction {
		width: 100vw;
		height: 100vh;
		position: fixed;
		left: 0;
		top: 0;
		z-index: 99;
	
		background-color: rgba(0, 0, 0, 0.65);
	
		
		.maskAuction_box {
			width: 598rpx;
			height: 548rpx;
			background: #FFFFFF;
			border-radius: 20rpx;
			position: absolute;
			top: 50%;
			transform: translateY(-60%);
			left: 50%;
			margin-left: -299rpx;
			.fri_img{
				width: 598rpx;
				height: 548rpx;
			}
			.fri_box{
			  width: 598rpx;
			  height: 548rpx;
				position: absolute;
				top: 0;
				display: flex;
				flex-direction: column;
				align-items: center;
				.text_view1{
					font-weight: 500;
					font-size: 36rpx;
					color: #666666;
					line-height: 50rpx;
					text-align: center;
					padding-top: 219rpx;
				}
				.text_view2{
					font-weight: 500;
					font-size: 28rpx;
					color: #333333;
				}
				.text_view1Lose{
					color: #333333;
				}
				.text_view2Lose{
					color: #8B8C8B;
				}
				.fri_btn{
					width: 450rpx;
					height: 94rpx;
					background: linear-gradient( 310deg, #F43B00 0%, #FA6D00 100%);
					border-radius: 47rpx;
					display: flex;
					align-items: center;
					justify-content: center;
					font-weight: bold;
					font-size: 34rpx;
					color: #FFFFFF;
					margin-top: 38rpx;
				}
			}
			
			.fot {
				position: absolute;
				height: 80rpx;
				bottom: -140rpx;
				width: 100%;
				display: flex;
				align-items: center;
				justify-content: space-around;
				.img{
					width: 63rpx;
					height: 63rpx;
				}
			}
	
			
		}
	
		.nomral-modal {
			text-align: center;
			width: 600rpx;
			padding-bottom: 48rpx;
			overflow: hidden;
	
			position: absolute;
			top: 50%;
			transform: translateY(-60%);
			left: 50%;
			margin-left: -300rpx;
			background: #FFFFFF;
			border-radius: 24rpx;
	
			.bg-top {
				width: 51%;
				height: 165rpx;
				background: #FA6400;
				top: 0;
				border-radius: 0 0 0% 80%;
				position: absolute;
				z-index: -1;
			}
	
			.left {
				left: 0;
			}
	
			.right {
				right: 0;
				border-radius: 0 0 80% 0% !important;
			}
	
			image {
				width: 170rpx;
				height: 170rpx;
				display: block;
				margin: 0 auto;
				margin-top: 54rpx;
				z-index: 1;
				margin-bottom: 14rpx;
			}
	
			.nomral-txt {
				width: 482rpx;
				text-align: center;
				margin: 0 auto;
				font-size: 28rpx;
				font-weight: bold;
				color: #141414;
				line-height: 50rpx;
			}
	
			.modal-btn {
				background-color: #FA6400;
			}
	
			.nomral-title {
				font-size: 28rpx;
				color: #141414;
				line-height: 40rpx;
			}
	
			.nomral-vip {
				font-size: 38rpx;
				font-weight: bold;
				color: #141414;
				line-height: 54rpx;
			}
	
			.nomral-btn {
				margin: 0 auto;
				margin-top: 54rpx;
			}
	
			.nomral-tip {
				text-align: center;
				width: 424rpx;
				margin: 0 auto;
				font-size: 20rpx;
				color: #666666;
				line-height: 28rpx;
				margin-top: 14rpx;
			}
	
			.modalBtnAll {
				margin: 54rpx 30rpx 0;
				display: flex;
				align-items: center;
				justify-content: space-between;
	
				.btnLeft {
					width: 260rpx;
					background-color: #FA6400;
					height: 88rpx;
					border-radius: 44rpx;
					text-align: center;
					color: #fff;
					font-size: 28rpx;
					font-weight: bold;
					color: #FFFFFF;
					line-height: 88rpx;
				}
	
				.btnRight {
					width: 260rpx;
					background-color: #FA6400;
					height: 88rpx;
					border-radius: 44rpx;
					text-align: center;
					color: #fff;
					font-size: 28rpx;
					font-weight: bold;
					color: #FFFFFF;
					line-height: 88rpx;
				}
			}
		}
	}

</style>
